وارد کردن شکل صحیح ایمیل و شماره تماس با جی کویری

پاسخ هوش مصنوعی

برای اعتبارسنجی ایمیل و شماره تماس با استفاده از جی کویری، می توانید از کد زیر استفاده کنید. این کد بررسی می کند که آیا ایمیل و شماره تماس به درستی وارد شده اند یا نه و اگر صحیح نبودند، هشدار می دهد.

$(document).ready(function() {
    $('#submit').click(function(event) {
        event.preventDefault(); // جلوگیری از ارسال فرم
        
        var email = $('#email').val();
        var phone = $('#phone').val();
        var emailPattern = /^[^@\s]+@[^@\s]+\.[^@\s]+$/; // الگوی اعتبارسنجی ایمیل
        var phonePattern = /^\d+$/; // الگوی اعتبارسنجی شماره تماس (فقط اعداد)

        if (!emailPattern.test(email)) {
            alert('لطفاً یک ایمیل معتبر وارد کنید.');
            return;
        }

        if (!phonePattern.test(phone)) {
            alert('لطفاً شماره تماس را به درستی وارد کنید. فقط اعداد مجاز هستند.');
            return;
        }

        // در صورت صحیح بودن ورودی ها، فرم ارسال می شود
        $('#myForm').submit();
    });
});

توجه داشته باشید که در این مثال فرض شده است که عناصر HTML شما به این شکل هستند:

    
    
    ارسال

اعتبارسنجی شماره تماس از طریق جی کوئری

برای اعتبار سنجی تکست باکس شماره تماس از طریق جی کوئری باید از عبارات با قاعده استفاده کنید. برای این منظور ابتدا در تگ form یک input با مشخصات زیر ایجاد کنید

<form>
    <input type="text" id="phoneNo" name="phoneNo" maxlength="11">
    <span id="spanmsg"></span>
</form>

در تگ input بالا مقدار maxlength را برابر با 11 قرار دهید چون شماره تماس 11 رقمی می باشد.

سپس در بخش جی کوئری کدهای زیر را بنویسید

    <script>
        $('#phoneNo').on('keyup', function (event) {
            var arregexe = /[0-9\-\(\)\s]+/;
            if (!arregexe.test(event.key)) {
                $("#spanmsg").html('شماره تماس صحیح نیست');
            } else {
                
                $("#spanmsg").html('شماره تماس صحیح است');
            }
        });
    </script>

در کدهای جی کوئری بالا از یک عبارت با قاعده استفاده شده است. به این ترتیب که فقط بایستی عدد وارد شود و در صورتی که حرفی وارد شود متد test مقدار false را برمیگرداند و عبارت "شماره تماس صحیح نیست" نمایش داده می شود.

برای کسب اطلاعات بیشتر در مورد اعتبارسنجی شماره تماس از طریق جی کوئری میتونید این لینک رو هم مشاهده بفرمایید

اعتبارسنجی ایمیل از طریق جی کوئری

برای اعتبارسنجی ایمیل از طریق جی کوئری هم دقیقا می تونید مشابه با اعتبارسنجی شماره تماس از طریق جی کوئری عمل کنید. برای این منظور یک تگ form با مشخصات زیر را ایجاد کنید

<form>
    
    <input type="text" id="email" name="email">
    <span id="spanmsg"></span>
</form>

حالا توسط دستورات جی کوئری اعتبارسنجی را انجام دهید

   <script>
        $('#email').on('keyup', function (event) {
            var arregexe = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            if (!arregexe.test(event.key)) {
                $("#spanmsg").html(' ایمیل صحیح نیست');
            } else {
                
                    $("#spanmsg").html(' ایمیل صحیح است');
            }
        });
    </script>

برای کسب اطلاعات بیشتر در مورد اعتبارسنجی ایمیل از طریق جی کوئری هم می تونید به این لینک مراجعه نمایید.

نکته ) با توجه به اینکه شما گفتید از فرم مودال استفاده می کنید بهتره که کدهای جی کوئری در view اصلی نوشته بشن نه در ویوهای مودال (یا همان پارشیال ویوها)

برای نوع ایمیل می تونید type رو برابر با email هم در نظر بگیرید.

<input type="email" id="email" />

در این صورت هم فقط باید ایمیل وارد بشه